<!DOCTYPE html>
<html lang="zh">
<head>
<title>商品进销存汇总 | OMS</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="Thu, 19 Nov 1900 08:52:00 GMT" />

<!-- 加载 bootstrap 样式-->
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/vendors/jquery-ui-1.10.4.custom/css/ui-lightness/jquery-ui-1.10.4.custom.min.css" />
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/vendors/font-awesome/css/font-awesome.min.css" />
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/vendors/bootstrap/css/bootstrap.min.css" />

<!-- 加载本页需要的三方插件样式 -->
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/vendors/jquery-tablesorter/themes/blue/style-custom.css">
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/vendors/animate.css/animate.css" />
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/vendors/iCheck/skins/all.css" />
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/vendors/bootstrap-daterangepicker/daterangepicker-bs3.css" />
<!-- 加载主题风格样式 -->
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/css/themes/style1/orange-blue.css"
	class="default-style" />
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/css/themes/style1/orange-blue.css"
	id="theme-change" class="style-change color-change" />
<link type="text/css" rel="stylesheet"
	href="/Apollo/madmin/css/style-responsive.css" />
<style>
body {
	background-color: #FFF;
}
</style>
</head>
<body class="">
	<!--BEGIN CONTENT-->
	<div class="modal-body">
		<div id="flat-skin" class="row skin skin-flat">
			<div class="table-responsive">
				<!-- 查询条件 -->
				<form id="frmSelPrjSku" action="#" class="form-horizontal">
					<div class="row">
					    <div class="col-lg-4 col-xs-4 col-sm-4 col-md-4">
                            <div class="form-group">
                                <label for="queryCond" class="col-sm-4 col-lg-4 col-xs-4 col-md-4 control-label">模糊查询</label>
                                <div class="col-sm-8 col-lg-8 col-xs-8 col-md-8">
                                    <input id="queryCond" name="queryCond" type="text" placeholder="商品名称/编码、规格名称/编码" class="form-control" value="" />
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-2 col-xs-2 col-sm-2 col-md-2">
                            <div class="form-group">
                                <label for="storId" class="col-sm-3 col-lg-3 col-xs-3 col-md-3 control-label">仓库</label>
                                <div class="col-sm-9 col-lg-9 col-xs-9 col-md-9">
                                    <select id="storId" name="storId" class="form-control">
                                        <option value="">请选择</option>
                                    </select>
                                </div>
                            </div>
                        </div>
					    <div class="col-lg-4 col-xs-4 col-sm-4 col-md-4">
                            <div class="form-group">
                                <label for="queryDateRange" class="col-sm-4 col-lg-4 col-xs-4 col-md-4 control-label">查询时间(最长31天)</label>
                                <div class="col-sm-8 col-lg-8 col-xs-8 col-md-8">
                                    <div class="btn btn-default reportrange" id="queryDateRange">
										<i class="fa fa-calendar"></i>&nbsp;&nbsp;<span class="rangeTitle">请选择查询日期</span>&nbsp;&nbsp;
										<i class="fa fa-angle-down"></i> 
										<input type="hidden" id="datestart" name="datestart" />
									    <input type="hidden" id="dateend" name="dateend" />
									</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-2 col-lg-2 col-xs-2 col-md-2">
                            <button type="button" id="queryBtn" name="queryBtn" class="btn btn-primary"><i class="fa fa-search"></i> 查询</button>
						    <button type="button" id="resetBtn" name="resetBtn" class="btn btn-default"><i class="fa fa-rotate-left"></i> 重置</button>
                        </div>
					</div>
				</form>
				<hr style="margin: 0px;" />
			</div>
		</div>
	</div>
	<div class="page-content">
		<div class="container-fluid">
			<div class="row">
				<iframe id="reportPage"
					style="width: 100%; height: 100%; min-height: 500px;"
					scrolling="auto" frameborder="0" src=""></iframe>
			</div>
		</div>
	</div>
	<!-- 导出文件 -->
	<!-- 加载 jquery js-->
	<script src="/Apollo/madmin/js/jquery-1.10.2.min.js"></script>
	<script src="/Apollo/madmin/js/jquery-migrate-1.2.1.min.js"></script>
	<script src="/Apollo/madmin/js/jquery-ui.js"></script>

	<!-- 加载 bootstrap 和三方插件 js -->
	<script src="/Apollo/madmin/vendors/bootstrap/js/bootstrap.min.js"></script>
	<script
		src="/Apollo/madmin/vendors/bootstrap-hover-dropdown/bootstrap-hover-dropdown.js"></script>
	<script src="/Apollo/madmin/js/html5shiv.js"></script>
	<script src="/Apollo/madmin/vendors/moment/moment.js"></script>
	<script src="/Apollo/madmin/js/respond.min.js"></script>
	<script
		src="/Apollo/madmin/vendors/jquery-validate/jquery.validate.min.js"></script>
	<script src="/Apollo/madmin/vendors/jquery-validate/message_zh.js"></script>
	<script
		src="/Apollo/madmin/vendors/bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script>
	<script
		src="/Apollo/madmin/vendors/bootstrap-daterangepicker/daterangepicker.js"></script>
	<script type="text/javascript">
		var reportBlankURL = "${report.server.url}blank.htm";
        window.onload = initIframeHeight;
        function initIframeHeight() {
            height = 450;
            var userAgent = navigator.userAgent;
            var iframe = parent.document.getElementById("contentFrame");
            var subdoc = iframe.contentDocument || iframe.contentWindow.document;
            var subbody = subdoc.body;
            var realHeight;
            //谷歌浏览器特殊处理
            if (userAgent.indexOf("Chrome") > -1) {
                realHeight = subdoc.documentElement.scrollHeight;
            } else {
                realHeight = subbody.scrollHeight;
            }
            if (realHeight < height) {
                $("#reportPage").height(height);
            } else {
                $("#reportPage").height(realHeight - 30);
            }
        }
     
        $('#queryCond').keydown(function(e){
            if (e.keyCode == 13) {
                return false;
            }
        });
        
        $(document).ready(function() {
            // 先登录到报表服务器
            $("#reportPage").attr("src", reportBlankURL);
            
            var temp = this.location.search.substring(this.location.search.indexOf("reportURL") + 10, this.location.search.length);
            $("#queryBtn").unbind("click").bind("click", function() {
            	var queryCond = $('#queryCond').val().trim();	                                // 模糊查询
            	var storId = $('#storId').val().trim();	                                        // 仓库
                var queryStartTimeString = $("#datestart",$("#queryDateRange")).val().trim();	// 查询开始时间
                var queryEndTimeString = $("#dateend",$("#queryDateRange")).val().trim();		// 查询结束时间
                
                var paramString = "";
                
                if (queryStartTimeString=="" || queryEndTimeString=="") {
                    window.top.window.showScoMessage('error', "查询时间必须输入");
                    return;
                } else {
                    var requestUrl = temp;
                    
	                paramString = "&i_prjId="+window.top.window.$("#projectSwitch").val()+"&i_searchCond="+queryCond+"&i_storId="+storId+"&i_startDate="+queryStartTimeString+"&i_endDate="+queryEndTimeString
                    requestUrl += (paramString);
	                    
                    $("#reportPage").attr("src", encodeURI(requestUrl));
                }
            });
            
            // 构建仓库下拉列表 
            $.ajax({
                type: "GET",
                url : "/stock/getStor.action",
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                success: function (data) {
                    if (data.result == "success") {
                        $("#storId option").remove();
                        $("#storId").append("<option value=''>请选择</option>");
                        $.each(data.data, function (n, value) {
                            $('#storId').append("<option value='" + value.storId + "'>" + value.storName + "</option>");
                        });
                    } else {
                        window.top.window.showModalAlert(data.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus) {
                    if (XMLHttpRequest.status == 500) {
                        var result = eval("(" + XMLHttpRequest.responseText + ")");
                        alert(result.errorObject.errorText);
                    }
                }
            });

            var daterangepickeroption = {
                ranges : {
                    '昨天' : [ moment().add('days', -1).startOf('day'), moment().add('days', -1).endOf('day') ],
                    '过去7天' : [ moment().add('days', -7).startOf('day'), moment().add('days', -1).endOf('day') ],
                    '过去30天' : [ moment().add('days', -30).startOf('day'), moment().add('days', -1).endOf('day') ],
                    '本月' : [ moment().startOf('month').startOf('day'), moment().endOf('month').endOf('day') ],
                    '上月' : [ moment().add('month', -1).startOf('month').startOf('day'), moment().add('month', -1).endOf('month').endOf('day') ]
                },
                timePicker : false,
                maxDate : moment().startOf('day').format('YYYY-MM-DD'),
                dateLimit : {
                    days : 30
                },
                opens : 'right', // 日期选择框的弹出位置
                buttonClasses : [ 'btn btn-default' ],
                applyClass : 'btn-small btn-primary blue',
                cancelClass : 'btn-small',
                format : 'YYYY-MM-DD', // 控件中from和to 显示的日期格式
                separator : ' 到 ',
                locale : {
                    applyLabel : '确定',
                    cancelLabel : '取消',
                    fromLabel : '起始时间',
                    toLabel : '结束时间',
                    customRangeLabel : '自定义',
                    daysOfWeek : [ '日', '一', '二', '三', '四', '五', '六' ],
                    monthNames : [ '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月' ],
                    firstDay : 1
                }
            };

            // 日期区间选择控件初始化
            $('#queryDateRange').daterangepicker(daterangepickeroption, setPayDateRange);
            
            $("#resetBtn").unbind("click").bind("click",function(){
            	$("#queryCond").val("");
            	$("#storId").val("");
                setdaterange(moment().add('days').startOf('day'),moment().add('days').startOf('day'),"queryDateRange");
            });
        });

        // 设置时间区间，用于区间的初始化和区间控件选择后的回调
        var setPayDateRange = function(start, end) {
            setdaterange(start,end,"queryDateRange");
        };
        
        var setdaterange = function(start, end, elementId) {
            // 清除查询条件
            $('span.rangeTitle').html("请选择查询日期");
            $('input[name="datestart"]').val("");
            $('input[name="dateend"]').val("");
            
            var dateRangeElement = $("#"+elementId);
            if (!start || !end) {
                $('span.rangeTitle',dateRangeElement).html("请选择查询日期");
                $('input[name="datestart"]',dateRangeElement).val("");
                $('input[name="dateend"]',dateRangeElement).val("");
            } else {
                $('span.rangeTitle',dateRangeElement).html(start.format('YYYY-MM-DD') + ' 至 ' + end.format('YYYY-MM-DD'));
                $('input[name="datestart"]',dateRangeElement).val(start.format("YYYY-MM-DD"));
                $('input[name="dateend"]',dateRangeElement).val(end.format("YYYY-MM-DD"));
            }
        };
         
        setdaterange(moment().add('days').startOf('day'),moment().add('days').endOf('day'),"queryDateRange");
    </script>
</body>
</html>